<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt"%>
<!DOCTYPE html>
<html lang="zh-CN">
<head>

  <fmt:setBundle basename="ApplicationMessage" />
  <fmt:setLocale value="zh_CN" />

  <%@ include file="/WEB-INF/include/meta.jsp"%>
  <%@ include file="/WEB-INF/include/css.jsp"%>
  <link href="${ctx.resource}/css/select2.css" rel="stylesheet">
  <link href="${ctx.resource}/css/select2-bootstrap.css" rel="stylesheet">

</head>
<body>

  <%@ include file="/WEB-INF/include/header.jsp"%>

  <div class="web-g-main">

	  <%@ include file="/WEB-INF/include/aside.jsp"%>

      <div class="content">
      
      	 <header class="header clearfix">
         	 <div class="row">
             	<div class="col-md-2">通道租约</div>
         	 </div>
          </header>

          <c:if test="${not empty infoMessage}">
            <div class="alert alert-success alert-dismissable alert-fade top-margin-10 text-align-center">
              <button type="button" class="close" data-dismiss="alert">&times;</button>
              <i class="glyphicon glyphicon-info-sign"></i>&nbsp;&nbsp;
              <fmt:message key="${infoMessage}" />
            </div>
          </c:if>
          
          <div class="earth-toolbar-wrapper clearfix">
          	
          	<div>
					<div class="col-md-3">
							<select class="form-control" name="partical">
				                      	<c:forEach var="partical" items="${particals}">
			                      				<option value="${partical.uniqueParticalId }" <c:if test = "${particalUniqueId eq  partical.uniqueParticalId}">selected</c:if>>
			                      					${partical.particalName }
			                      				</option>
			                      		
				                      	</c:forEach>
			             	</select>
					</div>
          	</div>
          
            <div class="btn-group pull-right">
              <a href="${ctx}/contract-partical/${particalUniqueId}/assign-contracts" class="btn btn-default btn-shadow btn-shadow-default demo2do-btn" title="添加通道租约"><i class="glyphicon glyphicon-plus"></i>&nbsp;&nbsp;划入租约</a>
            </div>
          </div>

          <table class="table table-striped demo2do-table bottom-margin-20">
            <thead>
              <tr>
                <th>序号</th>
                <th>租约编号</th>
                <th>承租人</th>
                <th>租期</th>
                <th>租金</th>
                <th>收租人</th>
                <th>付租方式</th>
                <th>状态</th>
                <th>操作</th>
              </tr>
            </thead>
            <tbody>
              <c:forEach var="particalContract" items="${particalcontracts}" varStatus="status">
                <tr contractId = ${particalContract.contract.id }>
                  <td>${status.index + 1}</td>
                  <td>${particalContract.contract.contractNo}</td>
                  <td>${particalContract.contract.customer.name}</td>
                  <td>
                    <fmt:formatDate value="${particalContract.contract.beginDate}" pattern="yyyy-MM-dd" /><br>
                                                            至<br>
                    <fmt:formatDate value="${particalContract.contract.endDate}" pattern="yyyy-MM-dd" />
                  </td>
                  <td>${particalContract.contract.monthFee}元/月</td>
                  <td>${particalContract.contract.app.name}</td>
                  <td><fmt:message key="${particalContract.contract.paymentInstrument.key}" /></td>
                  <td><fmt:message key="${particalContract.contract.contractStatus.key}" /></td>
                  <td>
                    <a href="javascript:void(0)" class="hover-no-text-decoration revoke-bill" title="划出租约">划出租约</a> &nbsp;&nbsp;
                  </td>
                </tr>
              </c:forEach>
            </tbody>
          </table>
          
          <c:choose>
            <c:when test="${not empty queryString}">
              <jsp:include page="/WEB-INF/include/page.jsp">
                <jsp:param name="url" value="/contract-partical/partical-contracts-list" />
                <jsp:param name="queryString" value="${queryString}" />
              </jsp:include>
            </c:when>
            <c:otherwise>
              <jsp:include page="/WEB-INF/include/page.jsp">
              <jsp:param value="/contract-partical/partical-contracts-list" name="url" />
              </jsp:include>
            </c:otherwise>
          </c:choose>
          
        </div><!-- layout right -->
        
          <!-- dialog begin -->
	  <div class="modal fade in bs-example-modal-sm" id="dialog" role="dialog" tabindex="-1" aria-labelledby="dialoglabel" aria-hidden="true">
		<div class="modal-dialog">
			<div class="modal-content">
				<div class="modal-header">
					<button type="button" class="close close-dialog" aria-label="关闭" ><span aria-hidden="true">&times;</span></button>
					<h4 class="modal-title" id="dialoglabel">提示</h4>
				</div>
				<div class="modal-body">
					<p></p>
				</div>
				<div class="modal-footer">
					<button type="button" class="btn btn-default close-dialog">关闭</button>
				</div>
			</div>
		</div>
	  </div><!-- dialog end -->

      </div><!-- panel body -->
      
  </div><!-- main content -->

  <%@ include file="/WEB-INF/include/script.jsp"%>
  <script src="${ctx.resource}/js/bootstrap-switch.min.js"></script>
  <script src="${ctx.resource}/js/bootstrap-modal-trigger.js"></script>
  <script src="${ctx.resource}/js/select2.min.js"></script>
  <script src="${ctx.resource}/js/select2_locale_zh-CN.js"></script>
  <script src="${ctx.resource}/js/bootstrap.validate.js"></script>
  <script src="${ctx.resource}/js/bootstrap.validate.en.js"></script>
  <script src="${ctx.resource}/js/earth-preupload.js"></script>
  <script src="${ctx.resource}/js/bootstrap-alert-fade-trigger.js"></script>
  <script>
  
  	$(function(){
  		
  		$("select[name='partical']").change(function(){
  			
  			var particalUniqueId = $(this).val();
  			
  			var href = window.location.href;
				
			var index = href.indexOf("particalUniqueId=");
			
			var location = "";
			
			if(index > - 1){
				location = href.replace(/particalUniqueId=\w*/,"particalUniqueId="+particalUniqueId);
			}else{
				location = href + "?particalUniqueId="+particalUniqueId;
			}
			window.location = location;
  			
  		});
  		
  		$(".revoke-bill").click(function(){
  			
  			var particalUniqueId = $("select[name='partical']").val();
  			
  			var contractIds = [];
  			
  			var contractId = Number($(this).parents("tr").attr("contractId"));
  			
  			contractIds.push(contractId);
  			
  			$.post('${ctx}/contract-partical/do-revoke-contracts',{
  				
  				uniqueId : particalUniqueId,
  				
  				contractIds : JSON.stringify(contractIds)
  				
  			}).done(function(data){
  				
  				var message = $.parseJSON(data).message;
 				 
 				 resultHandler(message,true);
  			});
  			
  		});
  		
  		var resultHandler = function(message,isReload){
 			 
			 $('#dialog').find('p').text(message).end().modal();
			 
			 $('#dialog .close-dialog').click(function(){
				 
				 $('#dialog').modal('hide');
				 
				 if(isReload){
				 
					 window.location.reload();
				};
			
			 });
 		 };
  		
  	});
  
  </script>
  
</body>
</html>
